﻿@model DPW.Models.CategoryDetailViewModel

@{
    ViewBag.Title = @Model.Category.Name;
}


<div class="main-content container-fluid">
		<div class="row-fluid">
			<div class="span3 left-sidebar">
				<div style="padding: 8px 0px;" class="side-wrapper  category">
					<ul class="nav nav-list">
					  <li class="nav-header">Categories</li>
					  <li class="divider"></li>
					  @*<li class="active"><a href="#">Humour</a></li>*@
                      @foreach (var cat in Model.Categories)
                      {
                          if (cat.Id == Model.Category.Id)
                          {
                              <li class="active"><a href="/c/@cat.Id" >@cat.Name (@cat.Poems.Count())</a></li>
                          }
                          else
                          {
                              <li><a href="/c/@cat.Id" >@cat.Name (@cat.Poems.Count())</a></li>
                          }
                      }
					</ul>
				</div>
				
				<div style="padding: 8px 0px;" class="side-wrapper  lastest">
					<ul class="nav nav-list">
					  <li class="nav-header">Latest</li>
					  <li class="divider"></li>
                      @foreach (var latestPoem in Model.LatestPoems)
                      {
                          <li><a href="/p/@latestPoem.Id" >@latestPoem.Name</a></li>

                      }
					  <li class="divider"></li>					  
					</ul>
					<div class="view-all">
						<a style="text-align: right" href="#">View All</a>
					</div>
				</div>
				
				<div style="padding: 8px 0px;" class="side-wrapper  random">
					<ul class="nav nav-list">
					  <li class="nav-header">Most Viewed Poems</li>
					  <li class="divider"></li>
					  @foreach (var mostViewedPoem in Model.MostViewedPoems)
       {
                          <li><a href="/p/@mostViewedPoem.Id" >@mostViewedPoem.Name</a></li>

       }
					  <li class="divider"></li>					  
					</ul>
					<div class="view-all">
						<a style="text-align: right" href="#">View All</a>
					</div>
				</div>
				
				
			</div>

			<div class="span9 right-sidebar">	
				<div class="row-fluid">

                <ul class="breadcrumb">
                  <li>@Html.ActionLink("Home", "Index", "Home") <span class="divider">/</span></li>
                  <li class="active">@Model.Category.Name</li>
                </ul>

				<section id="poem" class="poem">
					<div class="poem-content container-fluid">
						<div class="poem-header row-fluid">
							<div class="poem-tittle">
								<h2>@Model.Category.Name</h2>
							</div>
						</div>
						<div class="poem-body row-fluid">
                        @{
                            int count = Model.Poems.Count();
                            
                            <div class="row-fluid category">
                            <!-- RIGHT COLUMN -->
                            <div class="span6 row-fluid ">
                            @for (int i = 0 ; i < count ; i = i + 2)
                            {
                                <div class="row-fluid item">
                                    <h5 class="text-left"><a href="/p/@Model.Poems[i].Id">@Model.Poems[i].Name</a></h5>
                                    @if (!string.IsNullOrEmpty(Model.Poems[i].Summary) && Model.Poems[i].Summary.Length > 30)
                                    {
                                        <small>@Model.Poems[i].Summary.Substring(0, 30)...</small>
                                    }
                                    else
                                    {
                                        <small>@Model.Poems[i].Summary</small>
                                    }
                                    <small>@Model.Poems[i].DateCreatedShortDisplay</small>
                                </div>
                            }
                            </div>
                            <!-- LEFT COLUMN -->
                            <div class="span6 row-fluid ">
                            @for (int i = 1; i < count; i = i + 2)
                            {
                                <div class="row-fluid item">
                                    <h5 class="text-left"><a href="/p/@Model.Poems[i].Id">@Model.Poems[i].Name</a></h5>
                                    @if (!string.IsNullOrEmpty(Model.Poems[i].Summary) && Model.Poems[i].Summary.Length > 30)
                                    {
                                        <small>@Model.Poems[i].Summary.Substring(0, 30)...</small>
                                    }
                                    else
                                    {
                                        <small>@Model.Poems[i].Summary</small>
                                    }
                                    <small>@Model.Poems[i].DateCreatedShortDisplay</small>
                                </div>
                            }
                            </div>

                            </div>
                            
                        }
						</div>
                        <div class="poem-footer row-fluid">
                            
                        </div>
					</div>
				</section>
				
                           
				
				</div>
			</div>
		</div>
	</div>